﻿<?LassoScript
/*
This is an Open Source calendar based on the Jquery plugin Weekcalendar by Rob Monie with some additional Javascript by Jolle Carlestam. The server side is all Lasso on Knop written by Jolle Carlestam.

The file weekcalendar.lasso is the actual file opened by the user. It in turn call ajax.lasso to get or send the data needed.

*/


include('cfg__calendar.inc');

// language strings
include('language.inc');
?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>[$lang_messages -> calendartitle]</title>
        <link rel="stylesheet" type="text/css" href="reset.css">
        <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/start/jquery-ui.css">
        <link rel="stylesheet" type="text/css" href="jquery.weekcalendar.css">
        <link rel="stylesheet" type="text/css" href="weekcalendar.css">

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
        <script type="text/javascript" src="jquery.weekcalendar.js"></script>

<script type="text/javascript">

$(document).ready(function() {

	var $calendar = $("#calendar");

	$calendar.weekCalendar({
		timeslotsPerHour : 4,
		allowCalEventOverlap : true,
		firstDayOfWeek : 1,
		timeFormat: "H:i",
		dateFormat: "Y-m-d",
		use24Hour : true,
		useHolidayCSS : true,
		useWeekNo: true, // Added by Jolle 2009-08-10
		buttonText : {
			today : "[$lang_labels -> todayLbl]",
			lastWeek : "&nbsp;&lt;&nbsp;",
			nextWeek : "&nbsp;&gt;&nbsp;"
		},
		timeSeparator : " [$lang_labels -> to_2Lbl] ",
		businessHours :{start: 8, end: 18, limitDisplay: false },
		shortMonths : ['[']"[$lang_labels -> JanshortLbl]", "[$lang_labels -> FebshortLbl]", "[$lang_labels -> MarshortLbl]", "[$lang_labels -> AprshortLbl]", "[$lang_labels -> MayshortLbl]", "[$lang_labels -> JunshortLbl]", "[$lang_labels -> JulshortLbl]", "[$lang_labels -> AugshortLbl]", "[$lang_labels -> SepshortLbl]", "[$lang_labels -> OctshortLbl]", "[$lang_labels -> NovshortLbl]", "[$lang_labels -> DecshortLbl]"[']'],
		longMonths : ['[']"[$lang_labels -> JanuaryLbl]", "[$lang_labels -> FebruaryLbl]", "[$lang_labels -> MarchLbl]", "[$lang_labels -> AprilLbl]", "[$lang_labels -> MayLbl]", "[$lang_labels -> JuneLbl]", "[$lang_labels -> JulyLbl]", "[$lang_labels -> AugustLbl]", "[$lang_labels -> SeptemberLbl]", "[$lang_labels -> OctoberLbl]", "[$lang_labels -> NovemberLbl]", "[$lang_labels -> DecemberLbl]"[']'],
		shortDays : ['[']"[$lang_labels -> sundayshortLbl]", "[$lang_labels -> mondayshortLbl]", "[$lang_labels -> tuesdayshortLbl]", "[$lang_labels -> wednesdayshortLbl]", "[$lang_labels -> thursdayshortLbl]", "[$lang_labels -> fridayshortLbl]", "[$lang_labels -> saturdayshortLbl]"[']'],
		longDays : ['[']"[$lang_labels -> sundayLbl]", "[$lang_labels -> mondayLbl]", "[$lang_labels -> tuesdayLbl]", "[$lang_labels -> wednesdayLbl]", "[$lang_labels -> thursdayLbl]", "[$lang_labels -> fridayLbl]", "[$lang_labels -> saturdayLbl]"[']'],
		height : function($calendar) {
			return $(window).height() - $("h1").outerHeight();
		},
		eventRender : function(calEvent, $event) {
			if (calEvent.end.getTime() < new Date().getTime()) {
				$event.css("backgroundColor", "#aaa");
				$event.find(".wc-time").css({
					"backgroundColor" : "#999",
					"border" : "1px solid #888"
				});
			}
		},
		draggable : function(calEvent, $event) {
			return calEvent.readOnly != true;
		},
		resizable : function(calEvent, $event) {
			return calEvent.readOnly != true;
		},
		eventNew : function(calEvent, $event) {

			var $dialogContent = $("#event_edit_container");
			resetForm($dialogContent);
			var idField = $dialogContent.find("input['[']name='id'[']']");
			$.get("ajax.lasso", {"actiontype": "getNewID"}, function(data){idField.val(data)});
			var startField = $dialogContent.find("select['[']name='start'[']']").val(calEvent.start);
			var endField = $dialogContent.find("select['[']name='end'[']']").val(calEvent.end);
			var summaryField = $dialogContent.find("input['[']name='summary'[']']");
			var descriptionField = $dialogContent.find("textarea['[']name='description'[']']");
			var locationField = $dialogContent.find("input['[']name='location'[']']");


			$dialogContent.dialog({
				modal: true,
				title: "[$lang_labels -> neweventLbl]",
				close: function() {
					$dialogContent.dialog("destroy");
					$dialogContent.hide();
					$('#calendar').weekCalendar("removeUnsavedEvents");
				},
				buttons: {
					"[$lang_btns -> saveBtn]" : function(){
						$.ajax({
							type: "POST",
							url: "ajax.lasso?actionType=newevent",
							data: $("#event_edit_container form").serialize(),
							success: function(msg){
								msg.length > 0 ? alert(msg) :"";
								calEvent.id = idField.val();

								calEvent.start = new Date(startField.val());
								calEvent.end = new Date(endField.val());
								calEvent.summary = summaryField.val();
								calEvent.description = descriptionField.val();
								calEvent.location = locationField.val();

								$calendar.weekCalendar("removeUnsavedEvents");
								$calendar.weekCalendar("updateEvent", calEvent);
								$dialogContent.dialog("close");
							},
							error: function(e, r, s){
								var m = (r ? r : "");
								m += (s ? " " + s : "")
								alert("[$lang_messages -> servererroroccurred]: " + m);
							}
						})
					},
					"[$lang_btns -> cancelBtn]" : function(){
						$dialogContent.dialog("close");
						$calendar.weekCalendar("removeUnsavedEvents");
					}
				}
			}).show();

            $dialogContent.find(".date_holder").text($calendar.weekCalendar("formatDate", calEvent.start));
            setupStartAndEndTimeFields(startField, endField, calEvent, $calendar.weekCalendar("getTimeslotTimes", calEvent.start));
            $(window).resize().resize(); //fixes a bug in modal overlay size ??


		},
		eventDrop : function(calEvent, $event) {
						$.ajax({
							type: "POST",
							url: "ajax.lasso?actionType=updateevent",
							data: {"eventAction": "dropped", "id": calEvent.id, "start": calEvent.start, "end": calEvent.end},
							success: function(msg){
								msg.length > 0 ? alert(msg) :"";
							},
							error: function(e, r, s){
								var m = (r ? r : "");
								m += (s ? " " + s : "")
								alert("[$lang_messages -> servererroroccurred]: " + m);
							}
						})
					},
		eventResize : function(calEvent, $event) {
						$.ajax({
							type: "POST",
							url: "ajax.lasso?actionType=updateevent",
							data: {"eventAction": "resized", "id": calEvent.id, "start": calEvent.start, "end": calEvent.end},
							success: function(msg){
								msg.length > 0 ? alert(msg) :"";
							},
							error: function(e, r, s){
								var m = (r ? r : "");
								m += (s ? " " + s : "")
								alert("[$lang_messages -> servererroroccurred]: " + m);
							}
						})
					},
		eventClick : function(calEvent, $event) {

			if(calEvent.readOnly) {
				return;
			}

			var $dialogContent = $("#event_edit_container");
			resetForm($dialogContent);
			var startField = $dialogContent.find("select['[']name='start'[']']").val(calEvent.start);
			var endField = $dialogContent.find("select['[']name='end'[']']").val(calEvent.end);
			var summaryField = $dialogContent.find("input['[']name='summary'[']']").val(calEvent.summary);
			var descriptionField = $dialogContent.find("textarea['[']name='description'[']']");
			descriptionField.val(calEvent.description);
			var locationField = $dialogContent.find("input['[']name='location'[']']").val(calEvent.location);

			$dialogContent.dialog({
				modal: true,
				title: "[$lang_labels -> editLbl] - " + calEvent.summary,
				close: function() {
					$dialogContent.dialog("destroy");
					$dialogContent.hide();
					$('#calendar').weekCalendar("removeUnsavedEvents");
				},
				buttons: {
					"[$lang_btns -> saveBtn]" : function(){
						$.ajax({
							type: "POST",
							url: "ajax.lasso?actionType=updateevent",
							data: $("#event_edit_container form").serialize(),
							success: function(msg){
								msg.length > 0 ? alert(msg) :"";


								calEvent.start = new Date(startField.val());
								calEvent.end = new Date(endField.val());
								calEvent.summary = summaryField.val();
								calEvent.description = descriptionField.val();
								calEvent.location = locationField.val();

								$calendar.weekCalendar("removeUnsavedEvents");
								$calendar.weekCalendar("updateEvent", calEvent);
								$dialogContent.dialog("close");
							},
							error: function(e, r, s){
								var m = (r ? r : "");
								m += (s ? " " + s : "")
								alert("[$lang_messages -> servererroroccurred]: " + m);
							}
						})
					},
					"[$lang_btns -> deleteBtn]" : function(){
						if (confirm("[$lang_messages -> alertdeleterec]")){
							$.ajax({
								type: "POST",
								url: "ajax.lasso?actionType=deleteevent",
								data: {"id": calEvent.id},
								success: function(msg){
									msg.length > 0 ? alert(msg) :"";
									$calendar.weekCalendar("removeEvent", calEvent.id);
									$dialogContent.dialog("close");
								},
								error: function(e, r, s){
									var m = (r ? r : "");
									m += (s ? " " + s : "")
									alert("[$lang_messages -> servererroroccurred]: " + m);
								}
							})
						}
					},
					"[$lang_btns -> cancelBtn]" : function(){
						$dialogContent.dialog("close");
					}
				}
			}).show();

			var idField = $dialogContent.find("input['[']name='id'[']']").val(calEvent.id);
			var startField = $dialogContent.find("select['[']name='start'[']']").val(calEvent.start);
			var endField = $dialogContent.find("select['[']name='end'[']']").val(calEvent.end);
			$dialogContent.find(".date_holder").text($calendar.weekCalendar("formatDate", calEvent.start));
			setupStartAndEndTimeFields(startField, endField, calEvent, $calendar.weekCalendar("getTimeslotTimes", calEvent.start));
      		$(window).resize().resize(); //fixes a bug in modal overlay size ??

		},
		eventMouseover : function(calEvent, $event) {
		},
		eventMouseout : function(calEvent, $event) {
		},
		noEvents : function() {
		},
		data: function(start, end, callback) {
			$.getJSON("ajax.lasso", {
				actionType: "getcalendarevents",
				start: $calendar.weekCalendar("formatDate", start),
				end: $calendar.weekCalendar("formatDate", end)
			},  function(result) {
				callback(result);
			});
		},
		holidays: function(start, end, callback) {
			$.getJSON("ajax.lasso", {
				actionType: "getholidays",
				start: $calendar.weekCalendar("formatDate", start),
				end: $calendar.weekCalendar("formatDate", end),
				endtest: end
			},  function(result) {
				callback(result);
			});
		},
		holidayCont : ['[]'],
		holidayCheck : false
	});

	function resetForm($dialogContent) {
		 $dialogContent.find("input").val("");
		 $dialogContent.find("textarea").val("");
	}

	/*
	 * Sets up the start and end time fields in the calendar event
	 * form for editing based on the calendar event being edited
	 */
	function setupStartAndEndTimeFields($startTimeField, $endTimeField, calEvent, timeslotTimes) {

		for(var i=0; i<timeslotTimes.length; i++) {
			var startTime = timeslotTimes['[']i[']'].start;
			var endTime = timeslotTimes['[']i[']'].end;
			var startSelected = "";
			if(startTime.getTime() === calEvent.start.getTime()) {
				startSelected = "selected=\"selected\"";
			}
			var endSelected = "";
			if(endTime.getTime() === calEvent.end.getTime()) {
				endSelected = "selected=\"selected\"";
			}
			$startTimeField.append("<option value=\"" + startTime + "\" " + startSelected + ">" + timeslotTimes['[']i[']'].startFormatted + "</option>");
			$endTimeField.append("<option value=\"" + endTime + "\" " + endSelected + ">" + timeslotTimes['[']i[']'].endFormatted + "</option>");

		}
		$endTimeOptions = $endTimeField.find("option");
		$startTimeField.trigger("change");
	}

	var $endTimeField = $("select['[']name='end'[']']");
	var $endTimeOptions = $endTimeField.find("option");

	//reduces the end time options to be only after the start time options.
	$("select['[']name='start'[']']").change(function(){
		var startTime = $(this).find(":selected").val();
		var currentEndTime = $endTimeField.find("option:selected").val();
		$endTimeField.html(
			$endTimeOptions.filter(function(){
				return startTime < $(this).val();
			})
		);

		var endTimeSelected = false;
		$endTimeField.find("option").each(function() {
			if($(this).val() === currentEndTime) {
				$(this).attr("selected", "selected");
				endTimeSelected = true;
				return false;
			}
		});

		if(!endTimeSelected) {
			//automatically select an end date 2 slots away.
			$endTimeField.find("option:eq(1)").attr("selected", "selected");
		}

	});

	$("#exportchoice").change(function(){

		if($(this).val()) {
			window.location.href = "ajax.lasso?actionType=" + $(this).val() + "&start=" + dates.start + "&end=" + dates.end;
		}
	});

	var $about = $("#about");

	$("#about_button").click(function(){
		$about.dialog({
			title: "[$lang_messages -> aboutthecalendar]",
			width: 600,
			close: function() {
				$about.dialog("destroy");
				$about.hide();
			},
			buttons: {
				[$lang_btns -> closeBtn] : function(){
					$about.dialog("close");
				}
			}
		}).show();
	});

	// Deal with imports of Icalendar files
	var $importical = $("#importical");

	$("#import_button").click(function(){

		window.open("ajax.lasso?actionType=initimport&checkValue=", "Import","status=no,addressbar=no,scrollbars=no,resizable=yes,width=333,height=100");

	});

});

function wc_refresh() {
	$("#calendar").weekCalendar("refresh");
}

</script>
</head>
<body>
        <h1>[$lang_messages -> calendartitle]</h1>
        <div id="about_button_container">
        		<select id="exportchoice" name="exportchoice">
				<option label="[$lang_labels -> chooseexportLbl]" value="" selected="selected">[$lang_labels -> chooseexportLbl]</option>
				<option label="[$lang_labels -> thisweekasical]" value="exporticalweek">[$lang_labels -> thisweekasical]</option>
				<option label="[$lang_labels -> allasical]" value="exporticalall">[$lang_labels -> allasical]</option>
			</select> - - 
                <button type="button" id="import_button">[$lang_labels -> importLbl]</button> - - 
                <button type="button" id="about_button">[$lang_labels -> aboutLbl]</button>
        </div>
        <div id='calendar'></div>
        <div id="event_edit_container">
                <form>
                        <input name="id" type="hidden">
                        <ul>
                                <li>
                                        <span>[$lang_labels -> dateLbl]: </span><span class="date_holder"></span>
                                </li>
                                <li>
                                        <label for="wc-cal_summary">[$lang_labels -> whatLbl]: </label><input id="wc-cal_summary" type="text" name="summary">
                                </li>
                                <li>
                                        <label for="wc-cal_location">[$lang_labels -> whereLbl]: </label><input id="wc-cal_location" type="text" name="location">
                                </li>
                                <li>
                                        <label for="wc-cal_start">[$lang_labels -> starttimeLbl]: </label><select id ="wc-cal_start" name="start"><option value="">[$lang_labels -> selectstarttimeLbl]</option></select>
                                </li>
                                <li>
                                        <label for="wc-cal_end">[$lang_labels -> endtimeLbl]: </label><select id="wc-cal_end" name="end"><option value="">[$lang_labels -> selectendtimeLbl]</option></select>
                                </li>
                                <li>
                                        <label for="wc-cal_description">[$lang_labels -> noteLbl]: </label><textarea id="wc-cal_description" name="description"></textarea>
                                </li>
                        </ul>
                </form>
        </div>
        <div id="about">[$lang_messages -> calabouttext]
        </div>

</body>
</html>